<template>
	<view class="content">
		<image class="logo" src="/static/logo.png"></image>
		<view class="infomation">
			<view class="infomation-item role">
				角色：{{role}}
			</view>
			<view class="infomation-item username">
				账号：{{username}}
			</view>
			<view class="infomation-item password">
				密码：{{password}}
			</view>
			<view class="infomation-item alias">
				用户名：{{alias}}
			</view>
			<view class="infomation-item address">
				邮箱：{{address}}
			</view>
			<view class=" updateInfo">
				<view @click="toUpdatePage" class="updateInfo">修改信息</view>
			</view>
			<view class="logout infomation-item">
				<button type="warn" @click="logout">退出登录</button>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				role: '管理员',
				username: 'admin',
				password: '******',
				alias: '半亩方塘',
				address: 'dengjiawen@bmft.com'

			}
		},
		onShow() {
			var user = getApp().globalData.user;
			this.role = user.roleName;
			this.username = user.username;
			this.password = user.password;
			this.alias = user.nickname;
			this.address = user.email;
		},
		methods: {
			logout(e) {
				uni.showModal({
					title: '确认退出',
					success(e) {
						//如果确定就退出
						if (e.confirm) {
							//删除信息.
							getApp().globalData.token = ""
							getApp().globalData.user = {}
							uni.navigateTo({
								url: '../login/login'
							})
						}

					}
				})
			},
			//修改信息
			toUpdatePage() {
				uni.showModal({
					title: '修改信息',
					success(e) {
						//如果确定才去修改,
						if (e.confirm) {
							uni.navigateTo({
								url: '../updateInfo/updateInfo'
							})
						}
					}
				})
			}
		}
	}
</script>

<style>
	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.infomation {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	/* 每个信息的样式 */
	.infomation-item {
		height: 50upx;
		width: 500upx;
		margin-top: 20upx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 20upx;
		color: #000000;
		background-color: #FFFFFF;
		text-align: center;
		border-bottom: 1upx solid #000000;
	}

	.updateInfo {
		color: #005fc5;
	}

	.logout {
		color: red;
	}
</style>
